<template>
  <div class="my-address common-page">
    <empty-data
      description='还没有收货地址哦~'
      :emptyImg='emptyImg'
      v-if='!addressList.length'
    ></empty-data>
    <div class="list-box">
      <address-item
        :showEdmit='true'
        :addressInfo="item"
        v-for='item in addressList'
        :key='item.id'
        @edmitAddress='edmitAddress'
        @addressItemClick='selectAddress'
      ></address-item>
    </div>
    <div class="button-box">
      <van-button
        type="primary"
        round
        @click="enterToEdmitAddress"
      >添加地址</van-button>
    </div>
  </div>
</template>

<script>
import EmptyData from "@/components/EmptyData";
import AddressItem from "@/components/AddressItem";
import apiAddress from "@/common/api/apiAddress";
import { Button } from "vant";
import store from "@/store";
import { mapGetters } from "vuex";
import Share from "./mixin/share";
export default {
  name: "MyAddress",
  components: {
    [EmptyData.name]: EmptyData,
    [AddressItem.name]: AddressItem,
    [Button.name]: Button,
  },
  mixins: [Share],
  data() {
    return {
      emptyImg: "http://alivod.sdxgxx.cn/image/default/37F4CA3CB27D4995850881EB0E2BB69B-6-2.png",
      isNotBack:false
    };
  },
  computed: {
    ...mapGetters(["userInfo", "addressList", "currAddressInfo"]),
  },
  watch: {
    addressList: {
      deep: true,
      handler: function (newVal) {
        this.setNewCurrAddress();
      },
    },
  },
  created() {
     if (this.$route.query.isNotBack) {
      this.isNotBack = this.$route.query.isNotBack || false;
    }
    this.getAddressList();
    this.setShare();
  },
  mounted() {},
  methods: {
    //  获取地址列表
    getAddressList() {
      this.$toast.loading();
      apiAddress
        .getAddressList({
          userId: this.userInfo.userId,
        })
        .then((data) => {
          this.$toast.clear();
          if (data.data) {
            store.dispatch("address/setAddressListIUnfo", data.data);
          }
        });
    },
    //  设置新的选中的地址
    setNewCurrAddress() {
      let tempIndex = this.addressList.findIndex((item) => {
        return item.id === this.currAddressInfo.id;
      });
      if (tempIndex === -1) {
        store.dispatch("address/setCurrAddressInfo", {});
      }
    },
    selectAddress(info) {
      if(this.isNotBack){
          return
      }
      
      store.dispatch("address/setCurrAddressInfo", info);
      this.$router.back();
    },
    //  进入编辑地址(添加)
    enterToEdmitAddress() {
      this.$router.push({
        path: "/edmitAddress",
      });
    },
    //  进入编辑地址(修改)
    edmitAddress(addressInfo) {
      this.$router.push({
        path: "/edmitAddress",
        query: {
          addressInfo: JSON.stringify(addressInfo),
        },
      });
    },
  },
};
</script>

<style lang="less" scoped>
@import "../common/css/common.less";

.my-address {
  padding-bottom: 144px;
}

.list-box {
  width: 100%;
  padding: 0 24px;
  box-sizing: border-box;
  background: #ffffff;
  border-radius: 12px;

  .address-item {
    padding-left: 0;
    padding-right: 0;
    border-bottom: 1px solid #d8d8d8;
  }

  .address-item:last-child {
    border: none;
  }
}
</style>
